<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>歌手修改</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport"
          content="width=device-width, initial-scale=1, maximum-scale=1">
    <meta name="apple-mobile-web-app-status-bar-style" content="black">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="format-detection" content="telephone=no">

    <link rel="stylesheet"
          href="css/font.css">
    <link rel="stylesheet"
          href="css/index.css">
    <script src="lib/layui/layui.js"
            charset="utf-8"></script>
    <script type="text/javascript"
            src="js/index.js"></script>
    <script type="text/javascript"
            src="js/jquery.js"></script>
    <script type="text/javascript"
            src="js/jquery-form.js"></script>

    <!--<style>
            .imgs{display: none;}
            .picture{display: none;}
        </style>-->


</head>
<body>

<div class="layui-card">
    <form class="layui-form layui-form-pane"
          action="../../Singer/updateSinger"
          id="update-form" method="post">
        <div class="layui-tab layui-tab-brief" lay-filter="docDemoTabBrief">
            <ul class="layui-tab-title">
                <li class="layui-this">基本信息</li>
            </ul>

            <div class="layui-tab-content">
                <div class="layui-tab-item layui-show">
                    <!--<form class="layui-form layui-form-pane" action="" id="add">-->
                    <input type="hidden" name="op" value="update">

                    <div class="layui-form-item">
                        <label class="layui-form-label"> <span class='x-red'>*</span>歌手编号
                        </label>
                        <div class="layui-input-block">
                            <input type="text" name="singerId" autocomplete="off" value=""
                                   class="layui-input" required="required" readonly="readonly">
                        </div>
                    </div>

                    <div class="layui-form-item">
                        <label class="layui-form-label"> <span class='x-red'>*</span>歌手名称
                        </label>
                        <div class="layui-input-block">
                            <input type="text" name="singerName" autocomplete="off" value=""
                                   placeholder="" class="layui-input" required="required">
                        </div>
                    </div>

                    <div class="layui-form-item">
                        <label class="layui-form-label"> <span class='x-red'>*</span>歌手简拼
                        </label>
                        <div class="layui-input-block">
                            <input type="text" name="singerAbbr" autocomplete="off" value=""
                                   placeholder="" class="layui-input" required="required">
                        </div>
                    </div>

                    <div class="layui-form-item">
                        <label class="layui-form-label"> <span class='x-red'>*</span>歌手类别
                        </label>
                        <div class="layui-input-block">
                            <select name="singerCategoryId" id="singerCategoryId" lay-search>

                                <option >---请选择歌手类别---</option>
                                <option value="1">流行</option>
                                <option value="2">说唱</option>
                                <option value="3">国风</option>
                                <option value="4">摇滚</option>
                                <option value="5">电子</option>
                                <option value="6">民谣</option>
                                <option value="7">R&B</option>
                                <option value="8">民族乐</option>
                                <option value="9">轻音乐</option>
                                <option value="10">爵士</option>
                                <option value="11">古典</option>
                                <option value="12">乡村</option>
                                <option value="13">蓝调</option>
                            </select>
                        </div>
                    </div>

                    <div class="layui-form-item">
                        <label class="layui-form-label"> <span class='x-red'>*</span>歌手性别
                        </label>
                        <div class="layui-input-block">
                            <input type="text" name="singerSex" autocomplete="off" value=""
                                   placeholder="" class="layui-input" required="required">
                        </div>
                    </div>

                    <div class="layui-form-item">
                        <label class="layui-form-label"> <span class='x-red'>*</span>歌手状态
                        </label>
                        <div class="layui-input-block">
                            <input type="text" name="singerStatus" autocomplete="off" value=""
                                   placeholder="" class="layui-input" required="required">
                        </div>
                    </div>

                    <div class="layui-form-item">
                        <label class="layui-form-label"> <span class='x-red'>*</span>歌手头像
                        </label>
                        <div class="layui-input-block">
                            <input type="text" name="singerImage" autocomplete="off" value=""
                                   placeholder="" class="layui-input" required="required">
                        </div>
                    </div>

                    <div class="layui-form-item">
                        <label class="layui-form-label"> <span class='x-red'>*</span>歌手描述
                        </label>
                        <div class="layui-input-block">
                            <input type="text" name="singerDescription" autocomplete="off" value=""
                                   placeholder="" class="layui-input" required="required">
                        </div>
                    </div>

                    <div class="layui-form-item">
                        <label class="layui-form-label"> <span class='x-red'>*</span>国籍
                        </label>
                        <div class="layui-input-block">
                            <input type="text" name="singerNationality" autocomplete="off" value=""
                                   placeholder="" class="layui-input" required="required">
                        </div>
                    </div>

                    <div class="layui-form-item">
                        <label class="layui-form-label"> <span class='x-red'>*</span>歌手出生日期
                        </label>
                        <div class="layui-input-block">
                            <input type="text" name="singerBirthday" autocomplete="off" value=""
                                   placeholder="" class="layui-input" required="required">
                        </div>
                    </div>

                    <div class="layui-form-item">
                        <label class="layui-form-label"> <span class='x-red'>*</span>地区
                        </label>
                        <div class="layui-input-block">
                            <select name="districtId" id="districtId" lay-search>
                                <option >---请选择歌手地区---</option>
                                <option value="1">内地</option>
                                <option value="2">港台</option>
                                <option value="3">欧美</option>
                                <option value="4">日本</option>
                                <option value="5">韩国</option>
                                <option value="6">其他</option>
                            </select>
                        </div>
                    </div>

                    <!--<div class="layui-form-item">
                        <label class="layui-form-label"> <span class='x-red'>*</span>管理员权限编号
                        </label>
                        <div class="layui-input-block">
                            <input type="text" name="jurisdictionId" autocomplete="off"
                                value="" placeholder="" class="layui-input" required = "required">
                        </div>
                    </div>-->

                    <!-- <div class="layui-form-item">
                        <label class="layui-form-label"> <span class='x-red'>*</span>封禁
                        </label>
                        <div class="layui-input-block">
                            <input type="checkbox" name="saleStatus" title="封禁">
                        </div>
                    </div> -->

                    <!-- <div class="layui-form-item">
                        <label for="link" class="layui-form-label"> <span
                            class="x-red">*</span>商品图片
                        </label>
                        <div class="layui-input-inline">
                            <div class="site-demo-upbar">
                            <button type="button" class="layui-btn" id="test3"><i class="layui-icon"></i>上传文件</button>

                        </div>
                            <input type="file" name="goodsImage" id="goodsimage">
                        </div>

                    </div> -->
                    <!-- <div class="layui-form-item imgs" id="imgshow">
                        <label class="layui-form-label">商品展示 </label> <img src=""
                            id="pimages" name="pimages" style="width: 400px; height: 200px;" />
                        <input id="avatar" name="image" required="" type="hidden"
                            value="images">
                    </div> -->


                    <div class="layui-form-item">
                        <button class="layui-btn" type="submit">修改歌手</button>
                    </div>
                    <!--</form>-->
                    <div style="height: 100px;"></div>
                </div>
            </div>
        </div>
    </form>
</div>
<script>
    layui.use('form', function(){
        var form = layui.form; //只有执行了这一步，部分表单元素才会自动修饰成功
        form.render();
    });
</script>

<script>
    //获取请求路径上携带的管理员信息
    let singerId = getUrlParams("singerId");
    let singerName = getUrlParams("singerName");
    let singerAbbr = getUrlParams("singerAbbr");
    let singerCategoryId = getUrlParams("singerCategoryId");
    let singerSex = getUrlParams("singerSex");
    let singerStatus = getUrlParams("singerStatus");
    let singerImage = getUrlParams("singerImage");
    let singerDescription = getUrlParams("singerDescription");
    let singerNationality = getUrlParams("singerNationality");
    let singerBirthday = getUrlParams("singerBirthday");
    let districtId = getUrlParams("districtId");
    //发起异步请求单个管理员信息
    /* $.post("../../admin/updateAdmin",{adminPhone:adminPhone},function(result,status,xhr){
     //获取管理员信息，填充到指定dom元素上
     let adminName = result.data.adminName;
     let adminPhone = result.data.adminPhone;
     let adminPassword = result.data.adminPassword;*/
    $("input[name='singerId").val(singerId);
    $("input[name='singerName").val(singerName);
    $("input[name='singerAbbr").val(singerAbbr);
    $("input[name='singerCategoryId").val(singerCategoryId);
    $("input[name='singerSex").val(singerSex);
    $("input[name='singerStatus").val(singerStatus);
    $("input[name='singerImage").val(singerImage);
    $("input[name='singerDescription").val(singerDescription);
    $("input[name='singerNationality").val(singerNationality);
    $("input[name='singerBirthday").val(singerBirthday);
    $("input[name='districtId").val(districtId);

    function getUrlParams(name) {
        //去除函数
        String.prototype.trim = function (char, type) {
            if (char) {
                if (type == 'left') {
                    return this.replace(new RegExp('^\\' + char + '+', 'g'), '');
                } else if (type == 'right') {
                    return this.replace(new RegExp('\\' + char + '+$', 'g'), '');
                }
                return this.replace(new RegExp('^\\' + char + '+|\\' + char + '+$', 'g'), '');
            }
            return this.replace(/^\s+|\s+$/g, '');
        };
        var newArray = new Array();
        var searchUrl = window.location.search;//用法看底下
        searchUrl = searchUrl.trim('?', 'left');
        // searchUrl.trim('?','left');  left 去除
        // searchUrl.trim('?','right');  right 去除
        if (searchUrl != null) {
            var searchData = searchUrl.split("&");//截取 url中的“&”,获得“=”后面的参数
            if (searchData.length > 0) {
                $.each(searchData, function (index, key) {
                    newArray[key.split("=")[0]] = decodeURI(key.split("=")[1]);
                })
                if (newArray[name] == undefined || newArray[name] == null || newArray[name] == '') {
                    return null;
                } else {
                    return newArray[name];
                }
            } else {
                return null;
            }
        } else {
            return null;
        }
    }

    select();
    function select() {
        //异步请求歌手类型名
        $.ajax({
            async: true,
            type: "get",
            url: "/SingerType/getSingerType",
            data: {},
            contentType: "application/x-www-form-urlencoded",
            dataType: "json",
            success: function (result, status, xhr) {
                var singerCategory = "<option value=\"0\">---请选择歌手类别---</option>";
                if (result.data != null) {
                    $.each(result.data, function (i, obj) {
                        singerCategory += "<option value=\"" + obj.singerTypeId + "\">" + obj.singerTypeName + "</option>";
                    })
                    $("#singerCategoryId").html(singerCategory);
                }
                $("#singerCategoryId option").each(function(index){
                    console.log(this.text)
                    console.log(singerCategoryId)
                    if(this.text == singerCategoryId){
                        this.selected=true;
                    }
                });
            }
        });


        //异步请求歌手地区
        $.ajax({
            async: true,
            type: "get",
            url: "/district",
            data: {},
            contentType: "application/x-www-form-urlencoded",
            dataType: "json",
            success: function (result, status, xhr) {
                var district = "<option value=\"0\">---请选择歌手地区---</option>";
                if (result.data != null) {
                    $.each(result.data, function (i, obj) {
                        district += "<option value=\"" + obj.districtId + "\">" + obj.districtName + "</option>";
                    })
                    $("#districtId").html(district);
                }
                $("#districtId option").each(function(index){
                    if(this.text == districtId){
                        this.selected=true;
                    }
                });
            }
        });


        /*});*/
        //对指定的表单绑定提交事件
        $("#update-form").submit(function () {
            //使用jQuery.form.js插件方法ajaxSubmit()异步提交表单
            $(this).ajaxSubmit(function (result) {
                layui.use('layer', function () {
                    if (result.status != 0) {
                        //证明商品修改成功
                        layer.msg(result.message, {
                            icon: 1,
                            time: 3000
                        });
                        //定时器
                        window.setTimeout(function () {


                            //关闭子窗口
                            var index = parent.layer.getFrameIndex(window.name);
                            parent.layer.close(index);
                            //调用首页的查询方法
                            window.parent.operate();

                        }, 3000);
                    } else {
                        //证明商品修改失败
                        layer.msg(result.message, {
                            icon: 5,
                            time: 3000
                        });
                    }
                });
            });
            //限制默认的表单
            return false;
        });


    }
</script>

</body>
</html>